<template>
  <div>
    <h1>{{ 1 + 1 }}</h1>
    <p>{{ age > 18 ? "成年" : "未成年" }}</p>
    <!-- v-bind:属性名="js中data中变量" -->
    <a v-bind:href="link" v-bind:title="title">点击百度</a>hr
    <a :href="link" :title="title">点击百度</a>
  </div>
</template>

<script>
console.log(123);
//插值  表达式一定有返回值
export default {
  // 默认导出
  data() {
    return {
      age: 16,
      link: "https://www.baidu.com",
      title: "我是标题",
    };
  },
};
</script>

<style scoped lang="less">
/* scoped有隔离的效果，就是样式只会对template有效 */
div {
  h1 {
    color: red;
  }
}
</style>
